<template>
	<!-- <view class="container">
		<view class="header">
			<text class="title">工单详情</text>
		</view>
		<view class="task-info">
			<view class="info-row">
				<text class="label">工单编号：</text>
				<text>{{ task.id }}</text>

			</view>
			<view class="info-row">
				<text class="label">工单类型：</text>
				<text>{{ task.title }}</text>
			</view>
			<view class="info-row">
				<text class="label">工单状态：</text>
				<text>{{ selectedOperateStatus }}</text>
			</view>
			<view class="info-row">
				<text class="label">申请时间：</text>
				<text>{{ task.createTime }}</text>
			</view>
			<view class="info-row">
				<text class="label">提交人：</text>
				<text>{{ task.userName }}</text>
			</view>
			<view class="info-row">
				<text class="label">提交人角色：</text>
				<text>{{ task.name }}</text>
			</view>
			<view class="info-row">
				<text class="label">紧急程度：</text>
				<text>{{ formatUrgency(task.urgency) }}</text>
			</view>
			<view class="info-row">
				<text class="label">超时预警：</text>
				<text>{{ formatTimeOut(task.TimeOutOperate) }}</text>
			</view>
		</view>
		<view class="action-buttons">
			<button v-if="canClaim" @click="claimOrder">接单</button>
			<button v-if="canDelegate" @click="delegateOrder">委派协作</button>
			<button v-if="canAcceptDelegate" @click="acceptDelegate">接受委派协作</button>
			<button v-if="canFinishDelegate" @click="finishDelegate">完成委派协作</button>
			<button v-if="canCompleteOrder" @click="completeOrder">完成工单操作</button>
			<button v-if="canViewCompletionForm" @click="viewCompletionForm">查看回单</button>
		</view>
	</view> -->
</template>

<script>
	export default {
		data() {
			return {
				task: {}, // 当前工单详情
				selectedOrderId: null, // 选中的工单ID
				selectedOperateStatus: null // 选中的工单状态
			};
		},
		onLoad(options) {
			this.selectedOrderId = options.orderId;
			this.selectedOperateStatus = options.operateStatus;
			// console.log(this.selectedOperateStatus);
			console.log(1);
			this.loadTaskDetails();
		},
		methods: {
			async loadTaskDetails() {
				try {
					const token = uni.getStorageSync('token');
					const res = await uni.request({
						url: `http://localhost:8082/api/common/orderDetail/${this.selectedOrderId}`,
						method: 'get',
						header: {
							'Authorization': 'Bearer ' + token
						}
					});

					if (res.statusCode === 200 && res.data.code === 1) {
						this.task = res.data.data;
						console.log(1);
					} else {
						uni.showToast({
							title: "加载工单详情失败",
							icon: 'none'
						});
					}
				} catch (err) {
					uni.showToast({
						title: "请求接口失败" + err.message,
						icon: 'none'
					});
				}
			},
			formatUrgency(urgency) {
				switch (urgency) {
					case 1:
						return '低';
					case 2:
						return '中';
					case 3:
						return '高';
					default:
						return '未知';
				}
			},
			formatTimeOut(timeOut) {
				return timeOut ? '是' : '否';
			},
			formatOperateStatus(operateStatus) {
				switch (operateStatus) {
					case 1:
						return "待接单";
					case 2:
						return "操作中";
					case 3:
						return "待接受委派";
					case 4:
						return "委派中";
					case 5:
						return "完成委派";
					case 6:
						return "已完成";
				}
			},
			claimOrder() {
				// 接单操作
				uni.showToast({
					title: "接单",
					icon: 'none'
				});
			},
			delegateOrder() {
				// 委派协作操作
				uni.showToast({
					title: "委派协作",
					icon: 'none'
				});
			},
			acceptDelegate() {
				// 接受委派协作操作
				uni.showToast({
					title: "接受委派协作",
					icon: 'none'
				});
			},
			finishDelegate() {
				// 完成委派协作操作
				uni.showToast({
					title: "完成委派协作",
					icon: 'none'
				});
			},
			completeOrder() {
				// 完成工单操作
				uni.showToast({
					title: "完成工单",
					icon: 'none'
				});
			},
			viewCompletionForm() {
				// 查看回单操作
				uni.showToast({
					title: "查看回单",
					icon: 'none'
				});
			},
			canClaim() {
				return this.selectedOperateStatus === 1;
			},
			canDelegate() {
				return this.selectedOperateStatus === 2;
			},
			canAcceptDelegate() {
				return this.selectedOperateStatus === 3;
			},
			canFinishDelegate() {
				return this.selectedOperateStatus === 4;
			},
			canCompleteOrder() {
				return this.selectedOperateStatus === 5;
			},
			canViewCompletionForm() {
				return this.selectedOperateStatus === 6;
			}
		}
	};
</script>

<style scoped>
	.container {
		padding: 20px;
		background-color: #f5f5f5f5f5;
		min-height: 100vh;
	}

	.header {
		background-color: #007aff;
		color: white;
		padding: 10px;
		text-align: center;
		margin-bottom: 20px;
	}

	.task-info {
		background-color: #fff;
		border-radius: 10px;
		box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
		padding: 10px;
		margin-bottom: 20px;
	}

	.info-row {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		margin-bottom: 10px;
	}

	.label {
		font-weight: bold;
		margin-right: 5px;
	}

	.action-buttons {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
	}

	.action-buttons button {
		background-color: #007aff;
		color: white;
		border: none;
		padding: 10px;
		border-radius: 5px;
		flex: 1;
		margin: 5px;
	}
</style>